﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Services.aspx.cs" Inherits="MonkeyWarranty.Web.InstantTickets.Services" %>
<%@ Import Namespace="Resources" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
    <title><%=GlobalStrings.OutsideService %></title>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <div class="row">
        <div class="col-lg-12">
            <h3><%=GlobalStrings.OutsideService %></h3>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-12">
            <div class="well">
                <div class="form-inline">
                    <input class="form-control" type="text" id="ticketcode" placeholder="<%=GlobalStrings.TicketNumber %>" />
                    Ngày giao <input type="text" id="dateStartFrom" class="form-control" style="width: 105px;" />-<input type="text" id="dateStartTo" class="form-control" style="width: 105px;" />
                    <select class="form-control" id="status">
                        <option value="0">-- <%=GlobalStrings.Status %> --</option>
                        <option value="1">Tiếp nhận</option>
                        <option value="2">Đang xử lý</option>
                        <option value="3">Hoàn thành</option>
                    </select>
                    <button class="btn btn-default" type="button" id="LoadButton"><i class="fa fa-search"></i></button>
                    <button class="btn btn-default" type="button" id="ResetButton"><i class="fa fa-refresh"></i></button>
                </div>
            </div>
            
            <div id="ServicesTableContainer"></div>
        </div>
    </div>
    
    <script type="text/javascript">
        $(function () {
            $("#menu-instant").addClass("active");
            $("#menu1-instant").addClass("collapse in");
            $("#instant-service").addClass("active");

            $("#dateStartFrom").calendar({ timeSeparators: null });
            $("#dateStartTo").calendar({ timeSeparators: null });

            LoadServices();
        });

        function LoadServices() {
            $('#ServicesTableContainer').jtable({
                paging: true,
                pageSize: 10,
                sorting: true,
                defaultSorting: 'InstantTicketCode DESC',
                actions: {
                    listAction: 'Services.aspx/ServiceList'
                    // deleteAction: 'Edit.aspx/TicketDeleteService'
                },
                fields: {
                    Id: {
                        key: true,
                        create: false,
                        edit: false,
                        list: false
                    },
                    InstantTicketCode: {
                        title: '<%=GlobalStrings.TicketNumber %>',
                        display: function(data) {
                            return '<a href="EditService.aspx?id=' + data.record.Id + '">' + data.record.InstantTicketCode + '</a>';
                        }
                    },
                    ServiceName: {
                        title: '<%=GlobalStrings.Name %>'
                    },
                    ServiceTypeName: {
                        title: '<%=GlobalStrings.ServiceType %>'
                    },
                    ErrorName: {
                        title: '<%=GlobalStrings.ErrorCode %>'
                    },
                    EmployeeName: {title: '<%=GlobalStrings.TechnicalEmployees %>'},
                    StartDateString: {title: '<%=GlobalStrings.StartDate %>'},
                    EndDateString: {title: '<%=GlobalStrings.EndDate %>'},
                    InstantServiceStatusName: {title: '<%=GlobalStrings.Status %>'},
                    Edit: {
                        title: '',
                        width: '1%',
                        sorting: false,
                        display: function (data) {
                            return '<a title="Cập nhật" href="EditService.aspx?id=' + data.record.Id + '&src=services"><i class="fa fa-2x fa-edit"></i></a>';
                        }
                    }
                }
            });

            // enters
            $('#ticketcode').keypress(function (e) {
                if (e.which == 13) {
                    e.preventDefault();
                    $('#LoadButton').click();
                }
            });

            //Re-load records when user click 'load records' button.
            $('#LoadButton').click(function (e) {
                e.preventDefault();
                var status = $('#status').val();
                if (status == 0) {
                    status = [];
                } else {
                    status = [$('#status').val()];
                }
                $('#ServicesTableContainer').jtable('load',
                {
                    search: {
                        Status: status,
                        TicketCode: $('#ticketcode').val(),
                        StartDateFromString: $('#dateStartFrom').val(),
                        StartDateToString: $('#dateStartTo').val()
                    }
                });
            });

            // Reset button
            $('#ResetButton').click(function (e) {
                e.preventDefault();
                $('#ticketcode').val('');
                $('#status').val('0');
                $('#dateStartFrom').val('');
                $('#dateStartTo').val('');
                $('#LoadButton').click();
            });

            $('#LoadButton').click();
        }
    </script>
</asp:Content>
